<template>
	<view>
		<!-- <u-image v-if="src" borderRadius="20" :src="src" width="392rpx" height="710rpx" mode="scaleToFill"></u-image> -->
		<view class="flex flex-column align-center u-m-t-50">
			<u-image v-if="src" :src="src" width="700rpx" mode="widthFix"></u-image>
		</view>
		<view class="u-m-x-50">
			<view class="flex justify-between u-m-t-50">
				<dy-button size="default" width="260rpx" height="80rpx" @click="save">保存海报</dy-button>
				<dy-button size="default" width="260rpx" height="80rpx" @click="send">发送好友</dy-button>
			</view>
		</view>
		<l-painter ref="painter" custom-style="position: fixed; left: 200%" />
	</view>
</template>

<script>
	export default {
		data() {
			return {
				src: '',
				title: '',
				inviteUrl: ''
			}
		},
		onLoad(options) {
			console.log(options);
			let obj = JSON.parse(options.info)
			this.title = obj.title
			this.src = obj.src
			let str = `${this.$_BASE_IMG_API}/dist/pages/group/groupIntevite/groupIntevite?id=${obj.id}&tjname=${this.userInfo.username}`
			this.inviteUrl = str
			console.log(this.inviteUrl,"this.inviteUrl");
		},
		onReady() {
			this._initDat()
		},
		methods: {
			async _initDat() {
				uni.showLoading()
				let obj = {
					css: {
						width: "700rpx",
						// paddingBottom: "40rpx",
						background: "#fff"
					},
					views: [
						{
							css: {
                padding: "20rpx",
								boxSizing: "border-box",
								background: "#fff",
								borderRadius: "16rpx",
								width: "700rpx",
								boxShadow: "0 20rpx 58rpx rgba(0,0,0,.15)"
							},
							views: [{
								src: this.src,
								type: "image",
								css: {
									objectFit: "cover",
									width: "660rpx",
									height: "700rpx"
								},
							}, {
								css: {
									marginTop: "30rpx"
								},
								views: [{
									text: this.title,
									type: "text",
									css: {
										paddingRight: "32rpx",
										boxSizing: "border-box",
										lineClamp: 2,
										color: "#333333",
										lineHeight: "1.8em",
										fontSize: "36rpx",
										width: "460rpx"
									},
								}, {
									text: this.inviteUrl,
									type: "qrcode",
									css: {
										width: "200rpx",
										height: "200rpx",
									},
								}],
								type: "view"
							}],
							type: "view"
						}
					]
				}
				await this.$refs.painter.render(obj);
				this.$refs.painter.canvasToTempFilePath({
					fileType: "jpg",
					quality: 1,
					success: (res) => {
						uni.hideLoading()
						this.src = res.tempFilePath
					},
				});
			},
			save() {
				uni.saveImageToPhotosAlbum({
					filePath: this.src,
					success: ()=> {
						uni.showToast({
							title: '保存成功'
						})
					}
				});
			},
			send() {
				uni.share({
					provider: "weixin",
					scene: "WXSceneSession",
					type: 0,
					href: this.inviteUrl,
					title: "共产星球分享",
					summary: "我正在使用共产星球低价拼团商品，快来一起拼团吧！",
					imageUrl: "https://ssjh.jifenma.com/assets/img/logo_gxxq.png",
					success: function(res) {
						console.log("success:" + JSON.stringify(res));
					},
					fail: function(err) {
						console.log("fail:" + JSON.stringify(err));
					}
				});
			}
		},
	}
</script>

<style scoped lang="scss">

</style>
